const { resolve } = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
    entry:'./src/index.js',
    output:{
        filename:'./js/build.js',
        path:resolve(__dirname,'./dist')
    },
    module:{
        rules:[
            {
                test:/\.less/,
                use:['style-loader','css-loader','less-loader']
            },
            {
                test:/\.(jpg|png|gif)$/,
                type:"asset",
                //解析
                parser: {
                    //转base64的条件
                    dataUrlCondition: {
                        maxSize: 8 * 1024, // 25kb
                    }
                },
                generator:{ 
                    //与output.assetModuleFilename是相同的,这个写法引入的时候也会添加好这个路径
                    filename:'assets/[name][ext]',
                    //打包后对资源的引入，文件命名已经有/assets了
                    publicPath:'./'
                }
            }
        ]
    },
    plugins:[
        new HtmlWebpackPlugin({
            template:'./src/index.html'
        })
    ],
    mode:'development'
}